import { Dialog, Popup } from 'vant';
import {
  computed, defineComponent, h, ref,
} from 'vue';

export default (c: any, attrs: any) => {
  const result = {
    hide: () => {},
    // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
    show: (data: any) => {},
    // eslint-disable-next-line no-undef
    Instance: null as any,
  };
  const comp = defineComponent({
    setup() {
      const showModal = ref(false);
      const scope = ref({} as any);
      const hide = () => {
        showModal.value = false;
      };
      // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
      const show = (data: any) => {
        scope.value = { ...data, $hide: hide };
        showModal.value = true;
      };
      result.hide = hide;
      result.show = show;

      const compAttr = computed(() => ({
        show: showModal.value,
        ...attrs,
        'show-confirm-button': scope.value.showConfirmButton || false,
        title: scope.value.title || attrs.title,
        'update:show': (e: any) => {
          showModal.value = e;
        },
      }));
      const compSlots = computed(() => ({
        default() {
          return h(c, { scope: scope.value, hide });
        },
      }));
      const compInstance = attrs.isDrawer ? Popup : Dialog;
      return () => {
        if (!showModal.value) return null;
        return h(compInstance, compAttr.value, compSlots.value);
      };
    },
  });
  result.Instance = comp;
  return result;
};
